import { Order } from './../../models/order';
import { AppStore } from './../../services/appStore';
import { Component, OnInit, Input, style } from '@angular/core';
import { OrderPriority } from "app/services";

@Component({
    selector: 'suspended-order',
    styleUrls: ['./index.scss'],
    template: `
        <div class="suspended_order" [ngClass]="!isFinishPage&&calcPriorityByElapsedTime(10000|delayTimer|async|elapsedTime:order.receiveTime|msecToS)"
        [class.active_lable]="selected"
        [class.new_finished_suspended_order]="isFinishPage">
            <div class="order_name">{{order.customerIdentity||order.serialNo}}</div>  
            <div class="order_number">
                <span class="pickup" *ngIf="pickup">起</span>
                <span class="number_tip">{{allItemCount}}菜</span>
                <i class="material-icons">keyboard_arrow_right</i>
            </div>
        </div>
    `
})
export class SuspendedOrder implements OnInit {
    @Input() order: Order;
    @Input() orderId: string;
    @Input() selected: boolean;
    @Input() isFinishPage: boolean;
    constructor(private appStore: AppStore) { }


    get pickup() {
        return this.order && this.order.items.some(item => item.pickup == "pickup" && Boolean(item.isLocalStall));
    }
    private calcPriorityByElapsedTime(elapsedTime: number) {
        const periority = this.appStore.orderStore.actions.calcPriorityByElapsedTime(elapsedTime);
        if (periority == OrderPriority.extremeHigh) {
            return "timeout_order";
        }
        return "";
    }

    get allItemCount() {
        const count = this.order && this.order.items.map(x => x.qty - (x.refundQty || 0)).reduce((x, y) => x + y, 0);
        return count;
    }

    ngOnInit() {

    }
}